﻿@model RH.Web.ViewModels.CategoryViewModel
@using RH.Web.Utility

@{
    String pageTitle = "Edit Category";
    if (Model != null && Model.ID == 0)
    {
        pageTitle = "Add New Category";
    }
    ViewBag.Title = Html.GetPageTitle(pageTitle);

    String _CategoryButtonText = Model.ID > 0 ? "Change" : "Select";
    List<RH.Web.ViewModels.CategoryViewModel> _Categories = ApplicationCache.Categories;
}

@section PageHeadSection{
<style type="text/css">
    div.TreeChildNode{padding-left:25px;}
</style>
}


@Html.JavaScript("jquery.validate.min.js", Url)
@Html.JavaScript("jquery.validate.unobtrusive.min.js", Url)


<div class="page-heading">
    <h1>@pageTitle</h1>
    <div>
        Add/Edit category details.
    </div>
</div>


@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)

    if (Model == null)
    {
            @: @Html.ErrorMessageBox("Sorry! Requested Category was not found for edit.")
    }
    else
    {
		<div class="GroupBox">
			@*<div class="GroupHeaderOverlay" style="width:140px;">Category Information</div>  *@  

			@Html.HiddenFor(model => model.ID)

			<div class="editor-label">
				@Html.LabelFor(model => model.Name)
			</div>
			<div class="editor-field">
				@Html.EditorFor(model => model.Name)
				@Html.ValidationMessageFor(model => model.Name)
                @Html.ValidationMessage("DuplicateCategory")
			</div>
            <div class="editor-label">
				@Html.LabelFor(model => model.Description)
			</div>
			<div class="editor-field">
                @Html.TextAreaFor(model => model.Description)				
				@Html.ValidationMessageFor(model => model.Description)
			</div>
            <div class="editor-label">
				@Html.LabelFor(model => model.ParentID)
			</div>
            <div class="editor-field">				
                <span id="spanSelectedCategory">@if (Model.ParentID > 0)
                                                {@Html.GetCategoryBreadCrumb(Model.ParentID.GetValueOrDefault(), true)}</span>
                <input id="btnCategorySelection" type="button" value="@_CategoryButtonText"/>
                @Html.HiddenFor(model => model.ParentID)				
			</div>
			<div class="editor-label">
				@Html.LabelFor(model => model.PropertyDefinition)
			</div>			
            <div class="editor-field">
                @Html.TextAreaFor(model => model.PropertyDefinition, new { @class = "LargeTextArea" })		
                <div>
                @if(ViewData.ModelState.Values.Any(E => E.Errors.Count > 0)){
                    var errors = ViewData.ModelState["PropertyDefinition"].Errors;
                    if(errors != null && errors.Count >0){
                        <span class="field-validation-error">@Html.Raw(errors[0].ErrorMessage)</span>
                    }
                }				    
                </div>
			</div>			
		    <div>
				<input type="submit" value="Save" />
			</div>
		</div>        
        //Category Selection Dialog Box Start
        <div id="divCategoryDialog">
            @*@Html.RenderCategoryTreeForEdit(_Categories, true, Model.ParentID.GetValueOrDefault())*@
            @Html.SelectableCategoryList(_Categories, true, Model.ParentID.GetValueOrDefault())
            <div class="clear"></div>  
            <div><a href="javascript:void(0);" onclick="ClearSelection();">Clear Selection</a></div>                    
        </div>
       //Category Selection Dialog Box End
        
        <script language="javascript" type="text/javascript">        
            var _CategoryDialog = null;    
            $(document).ready(function () {
            _CategoryDialog = $('#divCategoryDialog').dialog({
		        autoOpen: false,
		        title: 'Select Parent Category',
                modal: true,                
		        width: $('#divCategoryDialog').width(),
                buttons:{
                    'Select':function(){ @*Dialog's Select Button Click*@
                        SelectCategory();$(_CategoryDialog).dialog('close');
                    },
                    'Cancel': function(){$(this).dialog('close');}
                }
		    });
            $('#btnCategorySelection').click(function(){
                $('#divValidationMessage').hide(); $(_CategoryDialog).dialog('open');
            });
        });
        function GetCategoryBreadCrumb(categoryID){
            $.ajax({
                type: 'POST',                
                url: '@Url.Action("GetCategoryBreadCrumb", "Product", new { area = AppConstants.Area.PUBLIC })',
                data: 'categoryID=' + categoryID,
                success: function (result) {                    
                    $('#spanSelectedCategory').html(result);
                }
            });
        }
        function SelectCategory() {            
            var categoryID = $('#divCategoryDialog input[type=radio]:checked').val();
            if(categoryID == undefined || categoryID == null || categoryID == 0){
                $('#ParentID').val(''); $('#spanSelectedCategory').html('');
            }
            else
            {
                GetCategoryBreadCrumb(categoryID);
                $(_CategoryDialog).dialog('close');
                $('#ParentID').val(categoryID);
                var form = $('form').first();
                form.valid();                
            }
        }
        function ClearSelection(){
            $('#divCategoryDialog input[type=radio]:checked').attr('checked', false); 
            $('#ParentID').val('');           
        }
    </script>
    }
}

<div  class="GroupBox">
    @Html.ActionLink("Back to List", "List")
</div>

